<template>
  <div class="materialsApplicant">
    <el-header height="36px">
      <header-title :title="$route.meta.title" />
    </el-header>
    <el-tabs v-model="activeName" type="border-card" :before-leave="beforeClick" @tab-click="handleTabClick">
      <el-tab-pane label="物资申领" name="apply">
        <Material
          v-if="activeName === 'apply'"
          ref="materialRef"
          :show-header="false"
          :prj-params="prjParams"
          :meta-edit="metaEdit"
        />
      </el-tab-pane>
      <el-tab-pane label="物资退库" name="treasury">
        <RemoveMaterial
          v-if="activeName === 'treasury'"
          ref="removeMaterialRef"
          :prj-params="prjParams"
          :meta-edit="metaEdit"
        />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import HeaderTitle from '@/components/basic/HeaderTitle'
import Material from './material.vue'
import RemoveMaterial from './removeMaterial'
import { getQueryObject } from '@/utils'
import { beforeInquiryJumpApi } from '@/api/acceptanceManagement'
import { getPrjDetailApi } from '@/api/material'
import { msgInfoEl } from '@/utils'

export default {
    name: 'MaterialsApplicant',
    components: {
        HeaderTitle,
        Material,
        RemoveMaterial
    },
    data() {
        return {
            activeName: 'apply',
            prjParams: {},
            metaEdit: true,
            message: ''
        }
    },
    async created() {
        this.metaEdit = this.$route.meta.isEdit
        if (this.$route.meta.isEdit) {
            this.prjParams = getQueryObject()
            console.log(this.prjParams, 'this.prjParams')
        } else {
            const obj = getQueryObject()
            const res = await getPrjDetailApi(obj.projectNo)
            if (+res.code === 200) {
                this.prjParams = {
                    prjId: res.data.prjId,
                    manageMode: res.data.manageMode,
                    lkFrom: obj.lkFrom
                }
            } else {
                this.message = res.message
            }
        }
    },
    methods: {
        // 点击tab时
        handleTabClick(tab, event) {
            console.log(tab, event, 'handleTabClick', JSON.stringify(this.prjParams), tab.name, this.activeName)
            if (tab.name === 'treasury' && JSON.stringify(this.prjParams) !== '{}') {
                // 如果是编辑需要校验 否则查看不需要校验
                if (this.metaEdit) {
                    beforeInquiryJumpApi({ prjId: this.prjParams.prjId, queryType: '2' }).then(res => {
                        if (+res.code !== 200) {
                            this.activeName = 'apply'
                            return Promise.reject(res)
                        }
                        this.activeName = 'treasury'
                    })
                } else {
                    this.activeName = 'treasury'
                }
            }
        },
        beforeClick() {
            if (JSON.stringify(this.prjParams) === '{}') {
                msgInfoEl({
                    type: 'error',
                    message: this.message
                })
                return false
            }
        }
    }
}
</script>

<style lang="scss" scoped></style>
